<template>
  <div class="index">
    <header>
      <h1>青春有我·数据可视化</h1>
      <div class="right">
        <router-link to="/indexPage">
          <a class="rightOut">首页</a>
        </router-link>
        <router-link to="/acManagePage">
          <a class="rightOut">活动管理</a>
        </router-link>
        <router-link to="/growthProfile">
          <a class="rightOut">成长档案</a>
        </router-link>
        <router-link to="/setting">
          <a class="rightOut">设置</a>
        </router-link>
      </div>
    </header>

    <div class="bigBox">
      <div class="column data-l" style="height: 105vh;">
        <achieveData></achieveData>
        <moneyTrend></moneyTrend>
        <fundUse></fundUse>
      </div>

      <div class="column data-c" style="height: 105vh">
        <titleData></titleData>
        <digital-teach></digital-teach>
        <activityMap></activityMap>
      </div>

      <div class="column data-r">
        <activityShow></activityShow>
        <teamDev></teamDev>
        <influenceData></influenceData>
      </div>
    </div>
  </div>
</template>
<script>
import titleData from '../components/titleData.vue'
import activityMap from '../components/activityMap.vue'
import achieveData from '../components/achieveData.vue'
import moneyTrend from '../components/moneyTrend.vue'
import fundUse from '../components/fundUse.vue'
import influenceData from '../components/influenceData.vue'
import activityShow from '../components/activityShow.vue'
import teamDev from '../components/teamDev.vue'
import digitalTeach from '@/components/digitalTeach.vue'

export default {
  components: {
    digitalTeach,
    titleData: titleData,
    activityMap: activityMap,
    achieveData: achieveData,
    fundUse: fundUse,
    moneyTrend: moneyTrend,
    influenceData: influenceData,
    activityShow: activityShow,
    teamDev: teamDev
  }
}
</script>
<style lang="less" scoped>
.index {
  background: url("@/../public/static/img/bgd.png") no-repeat top center;
  width: 100vw;
  height: 100vh;
  overflow: auto;
}
header {
  position: relative;
  height: 1.125rem;
  line-height: 1.125rem;
  border-bottom: 1px solid #fcc17c;
  h1 {
    font-size: 0.5625rem;
    color: #fff;
    line-height: 1rem;
    text-align: center;
    font-weight: 600;
    font-family: monospace;
  }
  .right {
    position: absolute;
    top: 5px;
    right: 10px;
    a {
      text-decoration: none;
      font-size: 14px;
      padding-right: 8px;
      color: #fff;
    }
    a:hover {
      color: #ff8c00;
    }
  }
}
</style>
